<template>
	<div>
		<div>
			<image class="avatar" :src="me.icon" v-if="me != null"/>
			<div class="userItem" v-if="me != null" >
				<button class="userName">{{me.nickName}}</button>
				<view class="sign">{{me.introduce}}</view>
			</div>
			<button class="logout" @click="logout()">退出登录</button>
			<div style="clear: both;"></div>
		</div>
		
		
		
		<div>
			<div class="self">
				<view class="itemNumber" @click="Dynamic()">
					<view v-if="dynamic == null" style="font-weight: 700;">0</view>
					<view v-if="dynamic != null" style="font-weight: 700;">{{dynamic.length}}</view>
					<view>动态</view>
				</view>
				
				<view class="itemNumber" @click="Good()">
					<view v-if="mygoods != null" style="font-weight: 700;">{{mygoods.length}}</view>
					<view v-if="mygoods == null" style="font-weight: 700;">0</view>
					<view>我的商品</view>
				</view>
				
				<view class="itemNumber" @click="Fans()">
					<view v-if="me == null" style="font-weight: 700;">0</view>
					<view v-if="me != null" style="font-weight: 700;">{{me.fans}}</view>
					<view>粉丝</view>
				</view>
				
				<view class="itemNumber" @click="Follow()">
					<view v-if="follow == null" style="font-weight: 700;">0</view>
					<view v-if="follow != null" style="font-weight: 700;">{{follow.length}}</view>
					<view>关注</view>
				</view>
			</div>
			<div style="clear: both;"></div>
		</div>
		
		<view class="dynamic" v-for="dynamicItem in dynamic" v-if="dynamicShow">
			<button class="deleteBlog" @click="DeleteBlog(dynamicItem)">删除</button>
			<image class="avatar" :src="dynamicItem.images" @click="toBlogs(dynamicItem)" />
			<view class="dynamicTitle">{{dynamicItem.title}}</view>
			<view class="dynamicContent">{{dynamicItem.content}}</view>
			<view v-if="dynamicItem.comments != undefined" class="comments">{{dynamicItem.comments}}条评论</view>
			<view v-if="dynamicItem.comments == undefined" class="comments">0条评论</view>
		</view>
		
		<view class="fans" v-if="fansShow && fans != null" v-for="fanitem in fans">
			<image :src="fanitem.icon" class="fansicon"></image>
			<view class="fanname">
				{{fanitem.nickName}}
			</view>
		</view>
		
		<view class="fans" v-if="followShow" v-for="fanitem in follow">
			<image :src="fanitem.icon" class="fansicon"></image>
			<view class="fanname">
				{{fanitem.nickName}}
			</view>
		</view>

		<view v-if="goodsShow">
			<view class="Item" v-for="itemData in mygoods">
				<view v-if="itemData">
					<image @click="ToGood(itemData.id)" class="itemImage" :src="itemData.images" ></image>
					<p class="itemContent">{{itemData.name}}</p>
					<p class="itemMoney">${{itemData.price}}</p>
				</view>
				<button class="deleteGood" @click="deleteGood(itemData)">删除</button>
				<button @click="AddVoucher(itemData.id)" class="AddVoucher">添加优惠券</button>
				<view style="clear: both;height: 20px;"></view>
			</view>
			<view style="clear: both;height: 100px;"></view>
			<button @click="toAddGood()">上传商品</button>
		</view>

		<view style="height: 5vw;margin-top: 10vw;" ></view>
		<foot activeBtn = '4'></foot>
	</div>
</template>

<script>
	import foot from "../../component/foot.vue"
	var dynamicShow = true
	var goodsShow = false
	var fansShow = false
	var followShow = false

	var me = null
	var dynamic = null
	var fans = null
	var follow = null
	var mygoods = null
	
	export default{
		name: 'me',
		components:{
			'foot':foot	
		},
		data(){
			return{
				dynamicShow:dynamicShow,
				goodsShow:goodsShow,
				fansShow:fansShow,
				followShow:followShow,
				me:me,
				dynamic:dynamic,
				fans:fans,
				follow:follow,
				mygoods:mygoods
			}
		},
		onLoad:function(){
			
			uni.request({
				url: "http://" + getApp().globalData.IpAddr + "/user/me",
				method:"GET",
				header:{	'authorization':getApp().globalData.token	},
				success:res=>{
					// console.log(res)
					if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
					else {
						getApp().globalData.me = res.data.data
						this.me = getApp().globalData.me
						// console.log(getApp().globalData.me)
						getApp().globalData.userId = res.data.data.id
						
						uni.request({
							url: "http://" + getApp().globalData.IpAddr + "/user/get/followee/" + getApp().globalData.userId,
							method:"GET",
							header:{	'authorization':getApp().globalData.token	},
							success:res=> {
								if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
								else{
									getApp().globalData.following = res.data.data
									this.follow = getApp().globalData.following
								}
							}
						})
						
					}
				}
			})
						
			uni.request({
				url: "http://" + getApp().globalData.IpAddr + "/goods/mygoods",
				method:"GET",
				header:{	'authorization':getApp().globalData.token	},
				success:res=> {
					// console.log(res)
					if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
					else{
						getApp().globalData.mygoods = res.data.data
						// console.log(getApp().globalData.mygoods)
						this.mygoods = getApp().globalData.mygoods
					}
				}
			})
			
			uni.request({
				url: "http://" + getApp().globalData.IpAddr + "/blog/of/me?corrent=0",
				method:"GET",
				header:{	'authorization':getApp().globalData.token	},
				success:res=> {
					// console.log(res)
					if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
					else{
						getApp().globalData.dynamic = res.data.data
						this.dynamic = getApp().globalData.dynamic
					}
				}
			})
			
			this.fans = getApp().globalData.fans
			this.follow = getApp().globalData.following
			this.mygoods = getApp().globalData.mygoods
		},
		methods:{
			logout(){
				uni.request({
					url:"http://" + getApp().globalData.IpAddr + "/user/logout",
					method:"DELETE",
					header:{	'authorization':getApp().globalData.token	},
					success:res=>{
						// console.log(res)
						if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
						else{
							wx.showToast({	title: res.data.data,	duration: 2000	})
							getApp().globalData.token = "null"
							getApp().globalData.userId = "null"
							uni.reLaunch({
								url:"/pages/ext/loginBypassword"
							})
						}
					},
					fail:res=>{
						console.log(res)
					}
				})
			},
			deleteGood(itemData){
				// console.log(itemData.id)
				uni.request({
					url:"http://" + getApp().globalData.IpAddr + "/goods/" + itemData.id,
					method:"DELETE",
					success:res=>{
						if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
						else {
							wx.showToast({	title: "删除成功",	duration: 2000	})
							uni.request({
								url: "http://" + getApp().globalData.IpAddr + "/goods/mygoods",
								method:"GET",
								header:{	'authorization':getApp().globalData.token	},
								success:res=> {
									// console.log(res)
									if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
									else{
										getApp().globalData.mygoods = res.data.data
										// console.log(getApp().globalData.mygoods)
										this.mygoods = getApp().globalData.mygoods
									}
								}
							})
						}
					}
				})
				
				
				
			},
			DeleteBlog(Blog){
				// console.log(Blog.id)
				uni.request({
					url:"http://" + getApp().globalData.IpAddr + "/blog/" + Blog.id,
					method:"DELETE",
					success:res=>{
						if(!res.data.success) wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
						else {
							wx.showToast({	title: "删除成功",	duration: 2000	})
							uni.request({
								url: "http://" + getApp().globalData.IpAddr + "/blog/of/me?corrent=0",
								method:"GET",
								header:{	'authorization':getApp().globalData.token	},
								success:res=> {
									// console.log(res)
									if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
									else{
										getApp().globalData.dynamic = res.data.data
										this.dynamic = getApp().globalData.dynamic
									}
								}
							})
						}
					}
				})
			},
			toBlogs(BlogData){
				getApp().globalData.goodsId = BlogData.goodsId
				getApp().globalData.NowBlogId = BlogData.id
				uni.navigateTo({	url:"/pages/ext/BlogContent"	})
			},
			Dynamic(){
				uni.request({
					url: "http://" + getApp().globalData.IpAddr + "/blog/of/me?corrent=0",
					method:"GET",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						// console.log(res)
						if(!res.data.success)	wx.showToast({	title: res.data.errorMsg,	duration: 2000	})
						else{
							getApp().globalData.dynamic = res.data.data
							this.dynamic = getApp().globalData.dynamic
						}
					}
				})
				
				this.dynamicShow = true
				this.fansShow = false
				this.followShow = false
				this.goodsShow = false
			},
			Good(){
				uni.request({
					url: "http://" + getApp().globalData.IpAddr + "/goods/mygoods",
					method:"GET",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						// console.log(res)
						if(!res.data.success)	wx.showToast({	title: res.data.errMsg,	duration: 2000	})
						else{
							getApp().globalData.mygoods = res.data.data
							this.mygoods = getApp().globalData.mygoods
						}
					}
				})
				
				this.dynamicShow = false
				this.fansShow = false
				this.followShow = false
				this.goodsShow = true
			},
			Fans(){
				
				uni.request({
					url: "http://" + getApp().globalData.IpAddr + "/user/get/fans/" + getApp().globalData.userId,
					method:"GET",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						if(!res.data.success)	wx.showToast({	title: '发送请求失败',	duration: 2000	})
						else{
							getApp().globalData.fans = res.data.data
							this.fans = getApp().globalData.fans
						}
					}
				})
				this.dynamicShow = false
				this.fansShow = true
				this.followShow = false
				this.goodsShow = false
			},
			Follow(){
				
				uni.request({
					url: "http://" + getApp().globalData.IpAddr + "/user/get/followee/" + getApp().globalData.userId,
					method:"GET",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						if(!res.data.success)	wx.showToast({	title: '发送请求失败',	duration: 2000	})
						else{
							getApp().globalData.following = res.data.data
							this.follow = getApp().globalData.following
						}
					}
				})
				this.dynamicShow = false
				this.fansShow = false
				this.followShow = true
				this.goodsShow = false
			},
			ToGood(id){
				getApp().globalData.goodsId = id
				uni.navigateTo({	url: "/pages/ext/commodity"	})
			},
			toAddGood(){
				uni.navigateTo({
					url:'/pages/ext/addGood'
				})
			},
			AddVoucher(id){
				getApp().globalData.goodsId = id
				uni.navigateTo({	url: "/pages/ext/addvoucher"	})
			}
		}
	}
</script>

<style>
	.logout{
		margin-top: 20px;
		padding: 0px;
		width: max-content;
		float: right;
		background-color: transparent;
		color: red;
	}
	.logout::after{
		border: none;
	}
	.deleteGood{
		display: block;
		font-size: 5px;
		width: max-content;
		float: right;
		color: red;
	}
	.deleteGood::after{
		border: none;
	}
	.AddVoucher{
		width: max-content;
		display: block;
		font-size: 5px;
		float: left;
	}
	.deleteBlog{
		width: max-content;
		height: max-content;
		margin-top: 10px;
		font-size: 5px;
		float: right;
		background-color: transparent;
		color: red;
	}
	.deleteBlog::after{
		border: none;
	}
	.avatar{
		width: 20vw;
		height: 20vw;
		margin-left: 8vw;
		margin-top: 2vw;
		float: left;
	}
	.userName{
		background-color: transparent;
		padding: 0px;
		width: min-content;
		height: min-content;
		font-size: 4vw;
	}
	.userName::after{
		border: none;
	}
	.sign{
		font-size: 10px;
	}
	.userItem{
		display: block;
		float: left;
		margin-left: 3vw;
		margin-top: 1vh;
	}
	.itemNumber{
		display: block;
		margin: 0 auto;
		width: 25vw;
		height: min-content;
		float: left;
	}
	.itemNumber view{
		display: block;
		margin: 0 auto;
		text-align: center;
	}
	.self{
		align-items: center;
		margin-top: 3vh;
	}
	.dynamic{
		margin-top: 5vw;
		padding-top: 1vw;
		height: 25vw;
	}
	.dynamicTitle{
		font-size: 20px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		height: 10vw;
		margin-top: 3vw;
		margin-left: 30vw;
	}
	.comments{
		font-size: 5px;
		float: right;
		margin-right: 5vw;
	}
	.fans{
		width: 100vw;
		padding: 5vw;
	}
	.fansicon{
		width: 15vw;
		height: 15vw;
		float: left;
	}
	.fanname{
		margin-top: 5vw;
		margin-left: 25vw;
	}
	.Item{
		width: 40vw;
		height: 300px;
		padding: 5vw;
		float: left;
	}
	.itemImage{
		width: 100%;
		height: 40vw;
	}
	.itemContent{
		text-align: center;
		max-width: 45vw;
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-line-clamp: 2;
	}
	.itemMoney{
		text-align: left;
		margin-top: 3vw;
	}
</style>